<!--<%@ page language="java" contentType="text/html; charset=UTF-8"-->
<!--         pageEncoding="UTF-8"%>-->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
  <meta charset="UTF-8">
  <title>首页</title>
  <link rel='stylesheet' type="text/css" th:href="@{/css/bootstrap.min.css}">
  <link rel="stylesheet" type="text/css" th:href="@{/css/index.css}">
  <link rel="stylesheet" type="text/css" th:href="@{/css/header.css}">
  <link rel="stylesheet" type="text/css" th:href="@{/css/button.css}">

</head>
<body>
<!-- 使用 th:replace 指令引入通用模板 -->
<div th:replace="header :: header"></div>

<section class="hero is-small has-text-centered">
  <div class="hero-body">
    <h3 class="title has-text-link-dark"> Code Beautify </h3>
    <hr>
    <div class="grid">
      <a class="btn third" th:href="@{/convert/xmltojson}">XML To JSON</a>
      <a class="btn third" th:href="@{/convert/jsontoxml}" >JSON To XML</a>
      <a class="btn third" th:href="@{/convert/csvtoxml}" >CSV To XML</a>
      <a class="btn third" th:href="@{/convert/yamltoxml}" >YAML To XML</a>
      <a class="btn third" th:href="@{/convert/xmltoyaml}" >XML To YAML</a>
      <a class="btn third" th:href="@{/convert/jsontoyaml}" >JSON To YAML</a>
      <a class="btn third" th:href="@{/convert/csvtoyaml}" >CSV To YAML</a>
      <a class="btn third" th:href="@{/convert/yamltojson}" >YAML To JSON</a>
      <a class="btn third" th:href="@{/convert/xmltocsv}" >XML To CSV</a>
      <a class="btn third" th:href="@{/convert/jsontocsv}" >JSON To CSV</a>
      <a class="btn third" th:href="@{/convert/csvtojson}" >CSV To JSON</a>
      <a class="btn third" th:href="@{/convert/yamltocsv}" >YAML To CSV</a>
      <div th:each="convertTypeList : ${convertTypeList}">
        <!-- 在这里添加你想要循环的内容 -->
        <a class="btn third" th:href="@{'/convert/' + ${convertTypeList[0]} + 'to' + ${convertTypeList[1]}}" th:text="${convertTypeList[0]}+' to '+${convertTypeList[1]}" ></a>
      </div>
    </div>
  </div>
</section>

<script th:src="@{/js/jquery-3.6.0.min.js}"></script>
<!--头部js-->
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/js/header.js}"></script>


</body>
</html>